﻿<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>Demo::Web Cell::</title>
        <link rel="stylesheet" type="text/css" href="../main.css">
        <script src="../../release/jskit.core.js">
        </script>
        <script src="../JskitConfig_doc.js">
        </script>
    </head>
    <body>
    	<table>
    		<tr>
    			<td class="package">Web Cell</td>
    		</tr>
			<tr>
				<td class="content">
					<li>拖动页面改变cell的位置</li>
					<li>双击cell将其切换到中心位置</li>
					<br>
					<a href="webcell_view.html" target="_blank">查看效果</a>
				</td>
			</tr>
    		<tr>
    			<td class="title">引入必须的文件</td>
    		</tr>
			<tr>
				<td class="content">
				<textarea name="JskitSyntax_code"  class="html">
<script src="../../release/jskit.core.js"></script>
<script src="../../ui/JskitDynamic.js"></script>
<script src="../../ui/JskitAnimation.js"></script>
<script src="../../ui/JskitWebCell.js"></script>
		    	</textarea>
				</td>
			</tr>
			<tr>
				<td class="title">初始化对象</td>
			</tr>
			<tr>
				<td class="content">
				<textarea name="JskitSyntax_code"  class="js">
			var jwc = new JskitWebCell("jwc");
			var jd = new JskitDynamic("jd");
		    	</textarea>
				</td>
			</tr>
			<tr>
				<td class="title">页面装载完成后执行</td>
			</tr>
			<tr>
				<td class="content">
				<textarea name="JskitSyntax_code"  class="js">
				function PageOnload(){
					jwc.start();
					//jwc.check();
					jd.add(jwc.getCanvas());
					jd.setRealTime(true);
					jd.setOnMoveDone("jwc.move(jd.getOffsetX(),jd.getOffsetY());pushData();");
					jskitEvents.ready("onresize","jwc.refresh");
					pushData();
				}
		    	</textarea>
				</td>
			</tr>
			<tr>
				<td class="title">双击页面时移动cell的位置</td>
			</tr>
			<tr>
				<td class="content">
				<textarea name="JskitSyntax_code"  class="js">
			function PageOnDblclick(e){
				var o = e.srcElement;
				if(jwc.isCellChild(o)){
					var lat = parseInt(o.getAttribute("lat"));
					var lon = parseInt(o.getAttribute("lon"));
					jwc.moveTo(lat,lon,"jwc.refresh("+lat+","+lon+");jwc.zoomInMax();pushData();");
				}
			}
		    	</textarea>
				</td>
			</tr>
			<tr>
				<td class="title">cell的数据和填充方法</td>
			</tr>
			<tr>
				<td class="content">
				<textarea name="JskitSyntax_code"  class="js">
			var data = new Array();
			data.push(new Array(0,0,"#ffff00","center"));
			data.push(new Array(1,2,"#336699","adsfafds"));
			data.push(new Array(2,-2,"#336699","adsfafds"));
			data.push(new Array(2,5,"#336699","adsfafds"));
			data.push(new Array(2,-2,"#336699","adsfafds"));
			data.push(new Array(3,-1,"#336699","adsfafds"));
			data.push(new Array(3,9,"#336699","adsfafds"));
			data.push(new Array(3,3,"#336699","adsfafds"));
			data.push(new Array(-1,5,"#336699","adsfafds"));
			data.push(new Array(-1,8,"#336699","adsfafds"));
			data.push(new Array(-2,1,"#336699","adsfafds"));
			data.push(new Array(-2,-12,"#336699","adsfafds"));
			data.push(new Array(-3,-2,"#336699","adsfafds"));
			data.push(new Array(-3,-4,"#336699","adsfafds"));
			data.push(new Array(-3,5,"#336699","adsfafds"));
			data.push(new Array(-4,5,"#336699","adsfafds"));
			function pushData(){
				var obj = null;
				for(var i=0;i<data.length;i++){
					obj = jwc.getCell(data[i][0],data[i][1]);
					if(obj!=null){
						obj.style.backgroundColor = data[i][2];
						obj.innerHTML = data[i][3];
					}
				}
				obj = null;
			}
		    	</textarea>
					
				</td>
			</tr>
    	</table>
		
    </body>
</html>